<template>
    <div class="datas-container" v-loading="loading">
        <!--<h3 class="page-title"> 管理员管理 <small></small></h3>--><!--  :query-param="{ _status: 9 }" -->
        <datas ref="datas" form-code="_ADMIN" view-code="_USER_REGISTER" @selected-change="handleSelectedChange"><!-- :table-action-add-width="100" -->
            <template slot="datasActionWrap">
                <el-button size="mini" type="primary" @click="handleRegYes()">审批通过</el-button>
                <el-button size="mini" @click="handleRegNo()">审批不通过</el-button>
            </template>
            <!--<el-button slot="rowAction" size="mini">sss</el-button>-->
        </datas>

        <el-dialog
          :title="winName"
          v-model="showCreate"
          top="60px"
          :close-on-click-modal="false"
          :append-to-body="true">
            <c-create @close="closeWin" :mod-id.sync="modId" :show.sync="showCreate" :is-view.sync="isView"></c-create>
        </el-dialog>
    </div>
</template>

<script>
    import { mapState, mapActions } from 'vuex';
    import _ from 'lodash';

    export default {
        data() {
            return {
                showCreate: false,
                modId: null,
                isView: false,
                formLabelWidth: '120px',
                selected: [],
                loading: false,
            }
        },
        components: {

        },
        created () {
            // this.pid = this.$route.query.pid;
        },
        mounted () {
            // this.groupId = this.$route.params.groupId;
            this.init();
        },
        watch: {

        },
        filters: {},
        computed: {
            ...mapState([
                'loginUser'
            ])
        },
        methods: {
            init() {
                this.$nextTick(() => {
                    this.handleResize();
                });
            },
            handleResize() {
                if(!this.$refs.datasContainer || !this.$refs.datasContainer.getBoundingClientRect) return;

                let rect = this.$refs.datasContainer.getBoundingClientRect();
                let height = _.get(rect, 'height');

                if(this.searchMode) {
                    this.datasTableHeight = 300;
                } else {
                    if(height > 0) {
                        this.datasTableHeight = height;
                    }
                }
            },
            handleSelectedChange(vals) {
                this.selected = vals;
            },
            async handleRegDeal(type) {
                let ids = _.map(this.selected, "value");
                let name = _.join(_.map(this.selected, "label"));
                if(!ids || ids.length <= 0) {
                    this.$jui.toast("请选择人员！");
                    return;
                }

                let msg = "";
                if(type === 'YES') {
                    msg = `请确认审批通过以下人员：${ name }`;
                } else {
                    msg = `请确认审批不通过以下人员：${ name }`;
                }

                this.$confirm(msg, '提交确认').then(async () => {

                    let ret = await this.$japi.passport.registerApproval(ids, type);

                    if(ret) {
                        this.$refs.datas.handleClearSelectedItemAll();
                        this.$refs.datas.refresh();
                    }
                }).catch(e => {

                });
            },
            async handleRegYes() {
                await this.handleRegDeal('YES');
            },
            async handleRegNo() {
                await this.handleRegDeal('NO');
            }
        }
    }
</script>
<style scoped lang="scss">

</style>
